<?xml version="1.0" encoding="ISO-8859-1" ?>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <style type="text/css">
@import "<%=request.getContextPath() %>/js/dijit/themes/soria/soria.css";
@import "<%=request.getContextPath() %>/js/dijit/themes/tundra/tundra.css";
@import "<%=request.getContextPath() %>/js/dojox/grid/enhanced/resources/tundraEnhancedGrid.css";
@import "<%=request.getContextPath() %>/js/dojox/grid/enhanced/resources/EnhancedGrid_rtl.css";
.dojoxGrid table { margin: 0; } html, body { width: 100%; height: 100%;
            margin: 0; }
hr{
	color: #E0E690;
	background-color: #E0E690;
}
</style>
<script type="text/javascript">
dojo.require("dojo.parser");
dojo.require("dijit.form.Button");
dojo.require("dijit.TitlePane");
dojo.require("dijit.Toolbar");
dojo.require("dojox.grid.EnhancedGrid");
dojo.require("dojox.grid.enhanced.plugins.DnD");
dojo.require("dojox.grid.enhanced.plugins.Menu");
dojo.require("dojox.grid.enhanced.plugins.NestedSorting");
dojo.require("dojox.grid.enhanced.plugins.IndirectSelection");
dojo.require("dojox.grid.Selection");
dojo.require("dojox.data.QueryReadStore");
dojo.require("dojo.data.ItemFileReadStore");


var orderLayout = [{
                    field: 'Item',
                    name: 'Item',
                    width: '200px'
                },
                {
                    field: 'Quantity',
                    name: 'Quantity',
                    width: '50px'
                },
                {
                    field: 'Price',
                    name: 'Unit Price',
                    width: '50px'
                },
                {
                    field: 'Total',
                    name: 'Total (Qty*Price)',
                    width: '100px'
                }];

function  makePayment()
{
//	alert("make payment");	
	 var items = orderGrid.selection.getSelected();
	 var grandtotal=0;
    // var selectedItems = new Array();
     //alert("length "+ items.length);
     if (items.length > 0 ) {
         // Iterate through the list of selected items.
         // The current item is available in the variable
         // "selectedItem" within the following function:
         dojo.forEach(items, function(selectedItem) {
             if (selectedItem !== null) {
            	 
                 // Iterate through the list of attributes of each item.
                 // The current attribute is available in the variable
                 // "attribute" within the following function:
                 dojo.forEach(orderGrid.store.getAttributes(selectedItem), function(attribute) {                                	
                     // Get the value of the current attribute:
                                          
                     if (attribute == "Total") {                    	 
                     	var value = orderGrid.store.getValues(selectedItem, attribute);
                     	grandtotal = grandtotal + parseInt(value);
                     	//alert("grandtotal "+ grandtotal);
                     	//selectedItems.push(value);                                    
                     	//alert("value " + value);
                     }
                     // Now, you can do something with this attribute/value pair.
                     // Our short example shows the attribute together
                     // with the value in an alert box, but we are sure, that
                     // you'll find a more ambitious usage in your own code:
                     //alert('attribute: ' + attribute + ', value: ' + value);
                 }); // end forEach
             } // end if
         }); // end forEach
     } // end if     
     /*else {
     	alert("Please select the items for payment");  
     	return false;   	 
     } */
    //alert("Feel");
     var xhrArgs = {
    		 
             url: "makePayment.htm",                        
             mimetype: "text/json",                        
             content: {selectedIdsTotal: grandtotal},
             load: function(responseData) {     
                 //alert("hello" + responseData);                       
                 //var storeData = dojo.fromJson(responseData);       
                 //alert( " storeData"+ storeData);                     
                 //dojo.byId("response").innerHTML = "Added to Cart." + responseData;
                 try{                            	
                	var dialog = dijit.byId('loadPay');
					dialog.reset();
					dialog.titleNode.innerHTML = 'New Payment';                 
                	dialog.attr("content", responseData);
                	//var form = document.getElementById("frmDCC");
                	//alert( "netAmount " + form.elements['netAmount'].value);
                	//form.elements['netAmount'].value = grandtotal;               			 
                	dialog.show();                 
                		  
                 }catch(e){
                     alert("Exception:"+e);
                 }
             },
             error: function(error) {
                 //We'll 404 in the demo, but that's okay.  We don't have a 'postIt' service on the
                 //docs server.
                 alert("error "+ error);
                 //dojo.byId("response").innerHTML = "Try Again. Unable to add to cart.";
             }
         }
         //dojo.byId("response").innerHTML = "Adding to Cart..."
         //Call the asynchronous xhrPost
          var deferred = dojo.xhrPost(xhrArgs);
		
}
</script>
<div dojoType="dijit.Toolbar">
	    <div id ="makePayment" dojoType="dijit.form.Button"  onClick="makePayment();">
    	 <span>Make Payment</span>	
    	</div>
    <div dojoType="dijit.form.Button">
        <span>Help</span>
    </div>    
</div>
<br/>
<div dojoType="dijit.TitlePane" title="<b>Place Orders</b>" style="width:90%;height:80%;" >
	<!-- Data stores read data from a data store such as a servlet -->
	<div dojoType="dojox.data.QueryReadStore" jsId="placeOrderStore" url="showOrderPlaced.htm">
    </div>

	<!-- A grid displays data and offer useful operations such as client sorting -->
	<div id="orderGrid" jsId="orderGrid" dojoType="dojox.grid.EnhancedGrid" structure="orderLayout" store="placeOrderStore" style="width:90%;height:80%;"
		plugins="{nestedSorting: true, dnd: true, indirectSelection: true }" rowSelector="0px">
    </div>
</div>
<div dojotype="dijit.Dialog" href="" id="loadPay" preventcache="true" refreshonshow="true" title=""></div>
